<!DOCTYPE html>
<html ng-app="locationApp">
<head>
  <title>21.1 $location</title>
  <meta charset="utf-8">
  <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.2/css/bootstrap.css">
</head>
<body ng-controller="locationCtrl">
  <div class="container">
    <div ng-include="'../common/header.html'"></div>
    <input class="form-control" type="text" ng-model="location" ng-model-options="{getterSetter:true}"/>
    <p>完整url路径: <span>{{absurl}}</span></p>
    <p>url路径(当前url#后面的内容,包括参数和哈希值): <span>{{url}}</span>
      <button ng-click="changeUrl()">改变</button>
    </p>
    <p>相对路径(也就是当前url#后面的内容,不包括参数): <span>{{path}}</span>
      <button ng-click="changePath()">改变</button>
    </p>
    <p>协议(比如http,https): <span>{{protocol}}</span></p>
    <p>主机名: <span>{{host}}</span></p>
    <p>端口号: <span>{{port}}</span></p>
    <p>哈希值: <span>{{hash}}</span>
      <button ng-click="changeHash()">改变</button>
    </p>
    <p>search值序列化json:
      <span>{{search}}</span>
      <button ng-click="changeSearch_1()">改变1</button>
      <button ng-click="changeSearch_2()">改变2</button>
      <button ng-click="changeSearch_3()">改变3</button>
      <button ng-click="changeSearch_4()">改变4</button>
      <button ng-click="changeSearch_5()">改变5</button>
      <button ng-click="changeSearch_6()">改变6</button>
    </p>
    <a href="some1?foo=bar">/some1?foo=bar</a> |
    <a href="some2?foo=bar#myhash">/some2?foo=bar#myhash</a> |
    <a href="http://www.baidu.com">外部链接</a>
  </div>
</body>
</html>
<script src="http://cdn.bootcss.com/angular.js/1.3.8/angular.js" type="text/javascript"></script>
<script src="script.js"></script>






